<template>
	<view class="default-background my-background">
		<view class="my-page">
			<view class="title-bar" @click="toEdit">
				<image :src="user.logo ? user.logo : '../../static/logo.png'" class="user-logo" mode="aspectFill"></image>
				<view class="user-info-group">
					<view class="info-name">{{user.username}}</view>
					<view class="info-phone">{{user.phone}}</view>
				</view>
				<view class="icon-group">
					<uni-icons class="info-edit" type="right" size="30" style="color: #FFFFFF;"></uni-icons>
				</view>
			</view>
			<view class="fun-group" @click="toEditList()">
				<view class="fun-btn-group">
					<image src="@/static/my/my-house.svg" class="fun-btn-icon"></image>
					<view class="fun-btn-text">我的发布</view>
				</view>
			</view>
			<view class="fun-group" @click="toViewHistoryList()">
				<view class="fun-btn-group">
					<image src="@/static/my/view-history.svg" class="fun-btn-icon"></image>
					<view class="fun-btn-text">浏览历史</view>
				</view>
			</view>
			<view class="fun-group" @click="toFeedbackList()">
				<view class="fun-btn-group">
					<image src="@/static/my/feedback.svg" class="fun-btn-icon"></image>
					<view class="fun-btn-text">我的反馈</view>
				</view>
			</view>
			<view class="fun-group" @click="toLogout()">
				<view class="fun-btn-group">
					<image src="@/static/my/logout.svg" class="fun-btn-icon" style="height: 70rpx;"></image>
					<view class="fun-btn-text">退出登录</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import config  from "@/config/app.js"
	export default {
		data() {
			return {
				user: {}
			};
		},
		onShow() {
			this.getInfo();
		},
		methods: {
			toEdit() {
				uni.navigateTo({
					url: "./edit"
				})
			},
			getInfo() {
			// 判断是否登录，已登录获取当前登录信息，未登录跳转登录界面
				if (this.$utils.checkLogin()) {
					this.$request.request({
						url: "/user/info"
					}).then(res => {
						if (res.code == 401) {
							uni.navigateTo({
								url: "./login"
							})
						} else {
							if (res.data.logo) {
								res.data.logo = config.IMG_URL + res.data.logo
							}
							this.user = res.data;
						}
					})
				} else {
					uni.navigateTo({
						url: "./login"
					})
				}
			},
			toEditList() {
				uni.navigateTo({
					url: "../house/editList"
				})
			},
			toViewHistoryList() {
				uni.navigateTo({
					url: "../house/viewHistoryList"
				})
			},
			toFeedbackList() {
				uni.navigateTo({
					url: "../feedback/list"
				})
			},
			toLogout() {
				uni.showModal({
					title: "是否退出登录",
					cancelText:'否',
					confirmText:'是',
					success(res){
					  if(res.cancel){
					    
					  }else if(res.confirm){
							uni.setStorageSync("Authorization", "");
					    uni.switchTab({
					    	url: "../house/index"
					    })
						}
					}
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
.my-background {
	height: 100%;
	
	.my-page {
		
		.title-bar {
			padding: 20rpx 0;
			background-color: #11A8CD;
			color: #FFFFFF;
			display: flex;
			
			.user-logo {
				width: 120rpx;
				height: 120rpx;
				margin: 20rpx 20rpx;
				background-color: #FFFFFF;
				border-radius: 120rpx;
			}
			
			.user-info-group {
				flex: 1;
				color: #FFFFFF;
				padding: 25rpx 20rpx;
				
				.info-name {
					font-size: 18px;
					
				}
				
				.info-phone {
					margin-top: 10rpx;
					font-size: 16px;
				}
			}
			
			.icon-group {
				
				.info-edit {
					height: 100%;
					display: flex;
					flex-direction: row; 
					align-items: center;
				}
			}
		}
		
		.fun-group {
			background-color: #FFFFFF;
			margin: 14rpx 10rpx;
			padding: 10rpx 0;
			display: flex;
			direction: row;
			justify-content: center;
			border-radius: 20rpx;
			
			.fun-btn-group {
				
				.fun-btn-icon {
					display: flex;
					justify-content: center;
					align-items: center;
					width: 100%;
					height: 80rpx;
				}
				
				.fun-btn-text {
					font-size: 16px;
					line-height: 26px;
					
				}
				
			}
			
		}
	}
}
</style>
